<template>
	<view class="pageV">
		<u-navbar title="切换合伙人" placeholder :autoBack="true" leftIconColor="#fff" bgColor="#111111"
			:titleStyle="titleStyle">

		</u-navbar>
		<view class="hone">
			<view class="honeleft">
				<u-tabs :list="tablist" lineColor="#D4FF45" :activeStyle="activeStyle"
			:inactiveStyle="inactiveStyle" :is-scroll="false" :current="current" @change="change"></u-tabs>
			</view>
			<view class="honeright">
				<text class="rname">{{ userInfo.nickname }}</text>
				<image src="/shop/static/fan.png" class="fan"></image>
			</view>
		</view>
		<view class="htwo">
			<view class="htwoone">
				{{info.title?info.title:'本月数据'}}
			</view>
			<view class="htwolist">
				<view class="htitem" v-for="(item,index) in info.data">
					<text class="wan"><text class="wantxt">{{item.value}}</text>元</text>
					<text class="gxian">{{item.name}}</text>
				</view>
				<!-- <view class="htitem">
					<text class="wan"><text class="wantxt">12.00</text>万元</text>
					<text class="gxian">营业贡献额</text>
				</view>
				<view class="htitem">
					<text class="wan"><text class="wantxt">12.00</text>万元</text>
					<text class="gxian">营业贡献额</text>
				</view> -->
			</view>
		</view>
		<view class="hthree" v-for="(item,index) in cemu" :key="index">
			<text class="baoname">{{ item.name }}</text>
			<view class="thelist">
				<view class="theitem" v-for="(i,ind) in item.data" :key="ind" @click="navClick(i,ind)">
					<image :src="i.image?i.image:'/shop/static/renwu.png'" class="renwu"></image>
					<text class="zname">{{i.name}}</text>
				</view>
			</view>
		</view>
		<!-- <view class="hthree">
			<text class="baoname">管理中心</text>
			<view class="thelist">
				<view class="theitem" v-for="(item,index) in 7" :key="index">
					<image src="/shop/static/renwu.png" class="renwu"></image>
					<text class="zname">掌柜贡献分析</text>
				</view>
			</view>
		</view> -->
		<view class="qiehuan" @click="onSwitchClick()">切换角色</view>
		
		
		<!-- <view  v-if="mRoleList.length==0" class="noV">
			<image src="https://s1.ax1x.com/2023/04/19/p9FHmWR.png" mode="aspectFill"></image>
			<view>咦~，一片空白，还没有数据呢</view>
		</view> -->

		<!-- 海报 -->
		<uni-popup ref="imgPopup" type="center" background-color="#00000000">
			<view class="imgPupV">
				<image :src="imgURL" mode="widthFix" class="imgPupIv" @click="savePoster(imgURL)"></image>
				<!-- <text class="imgPupTv">长按上方图片保存并分享</text> -->
			</view>
		</uni-popup>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				titleStyle: {
					"color": "#ffffff"
				},
				activeStyle: {
					"color": "#B7DC3D",
					"font-size": "34rpx"
				},
				inactiveStyle: {
					"color": "#8D8D8D",
					"font-size": "32rpx"
				},
				mRoleList: [],
				pos: -1,
				type:0,//是否是第一次进来  0第一次  1第二次
				tablist: [{
					name: '共享店铺'
				},
				//  {
				// 	name: '员工合伙'
				// }
				],
				current: 0,
				navlist:[
					{id:1,name:'掌柜贡献分析',img:'/shop/static/renwu.png'},
					{id:2,name:'掌柜贡献排名',img:'/shop/static/renwu.png'},
					{id:3,name:'转介绍掌柜',img:'/shop/static/renwu.png'},
					{id:4,name:'掌柜冠军报表',img:'/shop/static/renwu.png'},
					{id:5,name:'待唤醒客户汇总',img:'/shop/static/renwu.png'},
					{id:6,name:'客源流失分析',img:'/shop/static/renwu.png'},
					{id:7,name:'掌柜管家',img:'/shop/static/renwu.png'},
				],

				userInfo: {},
				copartnerData: {},
				mRoleId:-1,
				info:{
					data:[]
				},//合伙人数据
				shop_id:'',
				cemu:[],//合伙人菜单
				imgURL:'https://www.wthoo.com/uploads/poster/2/24b4192ade53f7e4ad424fe5169b1672.png'
			}
		},
		onLoad(e) {
			this.mRoleId = e.id;
			this.shop_id = e.shop_id
			this.userInfo = uni.getStorageSync("user_info");
			this.getCopartnerData(); //信息
			this.getPartnerData(); //合伙人数据
			this.getMenuList(); //合伙人菜单
		},
		methods: {
			getCopartnerData() {//信息
				this.$api.getCopartnerData({
					role_id:this.mRoleId
				}).then((res) => {
					this.copartnerData = res;
				}).catch((e) => {
					uni.$u.toast(e.msg === undefined ? "请求失败" : e.msg)
				})
			},
			getPartnerData() {//合伙人数据
				this.$api.getPartnerData({
					role_id:this.mRoleId,
					type:'month'
				}).then((res) => {
					this.info = res;
				}).catch((e) => {
					uni.$u.toast(e.msg === undefined ? "请求失败" : e.msg)
				})
			},
			getMenuList() {//合伙人菜单
				this.$api.getMenuList({
					role_id:this.mRoleId
				}).then((res) => {
					this.cemu = res.data;
				}).catch((e) => {
					uni.$u.toast(e.msg === undefined ? "请求失败" : e.msg)
				})
			},
			getRoleList() {
				this.$api.getRoleList({}).then((res) => {
					this.mRoleList = res;
				}).catch((e) => {
					uni.$u.toast(e.msg === undefined ? "请求失败" : e.msg)
				})
			},
			change(index) {
				this.current = index;
			},
			navClick(item,index){
				let id = Number(index)+Number(1)
				// console.log(item.path)
				// console.log(item.path+'?mRoleId='+this.mRoleId)
				// if(item.name == '活动中心'){
				// 	this.$u.route({
				// 		url: '/shop/New/Activity'
				// 	})
				// }else if(item.name == '掌柜提现审核'){
				// 	this.$u.route({
				// 		url: '/shop/New/TiShen?shop_id='+this.shop_id
				// 	})
				// }else if(item.name == '掌柜贵宾卡服务'){
				// 	this.$u.route({
				// 		url: '/pages/me/Cards'
				// 	})
				// }else if(item.name == '基础设置'){
					
				// 	this.$u.route({
				// 		url: '/shop/New/Shezhi'
				// 	})
				// }else if(item.name == '意见反馈'){
				// 	this.$u.route({
				// 		url: '/shop/New/Fankui'
				// 	})
				// }else if(item.name == '共享商圈'){
				// 	this.$u.route({
				// 		url: '/shop/New/ShangQuan'
				// 	})
				// }else 
				if(item.name == '掌柜招募'){
					this.onShareClick()
				}else{
					this.$u.route({
						url: item.path,
						params: {
							mRoleId:this.mRoleId,
						}
					})
				}
				
				// if(id == 1){//掌柜贡献分析
				// 	this.$u.route({
				// 		url: '/shop/New/NewSOne'
				// 	})
				// }else if(id == 2){//掌柜贡献
				// 	this.$u.route({
				// 		url: '/shop/New/NewSTwo'
				// 	})
				// }else if(id == 3){//转介绍掌柜
				// 	this.$u.route({
				// 		url: '/shop/New/NewSThree'
				// 	})
				// }else if(id == 4){//冠军报表
				// 	this.$u.route({
				// 		url: '/shop/New/NewSFour'
				// 	})
				// }else if(id == 5){//待唤醒客户汇总
				// 	this.$u.route({
				// 		url: '/shop/New/NewSFive'
				// 	})
				// }else if(id == 6){//客户流失分析
				// 	this.$u.route({
				// 		url: '/shop/New/NewSSix'
				// 	})
				// }else if(id == 7){//掌柜管家
				// 	this.$u.route({
				// 		url: '/shop/New/NewSSeven'
				// 	})
				// }
			},
			onShareClick() {
				uni.showLoading({
					title: "加载中..."
				})
				this.$api.getQrcodenew({
					shop_id: this.shop_id,
				}).then((res) => {
					console.log(res)
					uni.hideLoading();
					this.imgURL = res;
					this.savePoster(this.imgURL)
					// this.$refs.imgPopup.open();
				}).catch((e) => {
					uni.hideLoading();
				})
			},
			onSwitchClick(){//切换合伙人
				this.$u.route({
					url: '/pages/me/CopartnerSwitch',
				})
			},
			savePoster(url) {
				let a = []
				a.push(url)
				uni.previewImage({
					urls: a,
					current: 0
				});
				// this.$refs.albumPopup.open();
			},
		}
	}
</script>

<style lang="scss">
	.pageV {
		display: flex;
		flex-direction: column;
		min-height: 100vh;
		padding-bottom: 40rpx;
		position: relative;
	}
	.hone{
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 0 30rpx;
		.honeleft{
			width: 75%;

		}
		.honeright{
			margin-left: auto;
			width: 25%;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: flex-end;
			.rname{
				font-size: 32rpx;
				font-weight: 500;
				color: rgba(255, 255, 255, 1);
			}
			.fan{
				width: 24rpx;
				height: 24rpx;
			}
		}
	}
	.htwo{
		margin: 30rpx;
		height: 220rpx;
		opacity: 1;
		border-radius: 20rpx;
		display: flex;
		position: relative;
		flex-direction: column;
		background: linear-gradient(135.89deg, rgba(212, 255, 69, 1) 0%, rgba(69, 255, 184, 1) 100%);
		.htwoone{
			height: 58rpx;
			opacity: 1;
			border-radius: 20rpx 0px 20rpx 0px;
			background: rgba(83, 201, 118, 1);
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 28rpx;
			font-weight: 400;
			color: rgba(51, 55, 55, 1);
			padding: 0 30rpx;
			position: absolute;
			left: 0;
			top: 0;
			
		}
		.htwolist{
				display: flex;
				flex-direction: row;
				margin-top: 80rpx;
				padding: 0 20rpx;
				.htitem{
					flex: 1;
					display: flex;
					flex-direction: column;
					align-items: center;
					justify-content: center;
					.wan{
						font-size: 24rpx;
						font-weight: 400;
						color: rgba(51, 55, 55, 1);
					}
					.wantxt{
						font-size: 40rpx;
						font-weight: 700;
						color: rgba(51, 55, 55, 1);

						position: relative;
						margin-right: 4rpx;
						top: 3rpx;
					}
					.gxian{
						font-size: 24rpx;
						font-weight: 400;
						color: rgba(51, 55, 55, 1);
					}
				}
			}
	}
	.hthree{
		border-radius: 10rpx;
		background: rgba(31, 31, 31, 1);
		margin: 0rpx 30rpx 30rpx;
		padding: 30rpx 30rpx 0;
		display: flex;
		flex-direction: column;
		.baoname{
			font-size: 32rpx;
			font-weight: 600;
			color: rgba(232, 232, 232, 1);
			margin-bottom: 30rpx;
		}
		.thelist{
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			.theitem{
				width: 33.33%;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				margin-bottom: 30rpx;
				.renwu{
					width: 62rpx;
					height: 62rpx;
					margin-bottom: 5rpx;
				}
				.zname{
					font-size: 24rpx;
					font-weight: 400;
					color: rgba(147, 147, 147, 1);
				}
			}
		}
	}
	.qiehuan{
		position: fixed;
		width: 181rpx;
		height: 80rpx;
		opacity: 1;
		border-radius: 136rpx 0px 0px 136rpx;
		background: rgba(212, 255, 69, 1);
		display: flex;
		align-items: center;
		justify-content: center;
		right: 0;
		bottom: 80rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: rgba(51, 55, 55, 1);
	}
	.noV {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin-top: 100rpx;
		image {
			width: 360rpx;
			height: 194rpx;
		}
	
		view {
			font-size: 28rpx;
			color: #999999;
			margin-top: 47rpx;
		}
	}
	.albumPupV {
		background-color: #fff;
		border-top-left-radius: 10rpx;
		border-top-right-radius: 10rpx;
		display: flex;
		flex-direction: column;
	}
	.albumPupTv1 {
		font-size: 30rpx;
		color: #333;
		display: flex;
		align-items: center;
		justify-content: center;
		padding-top: 30rpx;
		padding-bottom: 30rpx;
		border-bottom: 0.1rpx solid #eeeeee;
	}

	.albumPupTv2 {
		font-size: 30rpx;
		color: #333;
		display: flex;
		align-items: center;
		justify-content: center;
		padding-top: 30rpx;
		padding-bottom: 30rpx;
	}
	.imgPupV {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100vw;
	}
	.imgPupIv {
		width: 85%;
		height: 60vh;
	}
	.imgPupTv {
		color: #fff;
		font-size: 30rpx;
		margin-top: 30rpx;
	}
</style>
